import { userLogout } from '@/apis'
import { useUserStore } from '@/stores'
import { Button, message } from 'antd'
import { useNavigate } from 'react-router'

export const LogoutButton = () => {
  const setUser = useUserStore((state) => state.setUser)
  const navigate = useNavigate()
  const handleLogout = async () => {
    const res = await userLogout()
    if (res.data.code === 0) {
      setUser({
        userName: '未登录',
      })
      message.success('退出登录成功')
      navigate('/user/login')
    } else {
      message.error('退出登录失败，' + res.data.message)
    }
  }
  return (
    <Button onClick={handleLogout} className="flex items-center justify-center w-[175px]">
      Logout
    </Button>
  )
}
